<template>
	<uni-nav-bar  :fixed='fixed' :background-color='backgroundColor' :border="border">
	    <view class="header_middle">
			<slot />
		</view>
	    <view slot="left" class="header_left" @tap="back">
			<image src="/static/svg/return.svg"  class="header_back" v-if="leftImgBack"></image>
			<slot  name="left"></slot>
		</view>
	    <view slot="right" class="header_right">
			<slot  name="right"></slot>
		</view>
	</uni-nav-bar>
</template>

<script>
	import uniNavBar from "@/components/uni-nav-bar/uni-nav-bar.vue"
	export default {
		components: {uniNavBar},
		props: {
			leftImgBack: {
				type:[Boolean, String],
				default:true
			},
			fixed:{
				type:Boolean,
				default:false
			},
			backgroundColor:{
				type:String,
				default:'#FFFFFF'
			},
			border:{
				type:Boolean,
				default:false
			},
		},
		data() {
			return {
				
			};
		},
		methods: {
			back() {
				this.$emit('back')
			}
		},
	}
	
</script>

<style lang="scss" scoped>
	.header_left{
		height: 88rpx;
		width: 187.5rpx;
		display: flex;
		align-items: center;
		padding-left: 30rpx;
		.header_back{
			height: 44rpx;
			width: 44rpx;
		}
	}
	.header_middle{
		height: 88rpx;
		width: 375rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 36rpx;
		letter-spacing: 1rpx;
		color: #333333;
	}
	.header_right{
		height: 88rpx;
		width: 187.5rpx;
		min-width:187.5rpx;
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}
</style>
